<template>
	<view class="u-p-b-20">
		<u-navbar title="项目详情"></u-navbar>
		<u-card title="项目详情" :show-foot="false" v-if="project!=null" :border="false" border-radius="32">
			<u-form ref="uForm" class="u-p-l-20 u-p-r-20" label-width="150" slot="body">
				<u-form-item label="项目名称">
					<view>{{project.projectName}}</view>
				</u-form-item>
				<u-form-item label="项目编号">
					<view>{{project.projectId}}</view>
				</u-form-item>
				<u-form-item label="项目文件">
					<u-link style="max-width: 450rpx;" :href="project.file" under-line class="u-line-1">{{project.file}}
					</u-link>
				</u-form-item>
				<u-form-item label="项目类别">
					<view class="u-flex-1">
						<u-tag :text="tag" :type="getColor(index)" class="u-m-r-20"
							v-for="(tag,index) in project.projectTag" :key="index" />
					</view>
				</u-form-item>
				<u-form-item label="简介" label-position="top" :border-bottom="false">
					<text>{{project.description}}</text>
				</u-form-item>
			</u-form>
		</u-card>
		<u-card title="团队成员" :show-foot="false" v-if="member!=null" :border="false" border-radius="32">
			<u-form ref="uForm" class="u-p-l-20 u-p-r-20" label-width="150" slot="body">
				<u-form-item label="团队编号">
					<view>{{member.groupId}}</view>
				</u-form-item>
				<u-form-item label="队长">
					<view>{{member.masterName}}</view>
				</u-form-item>
				<u-form-item label="队员1">
					<view>{{member.memberOneName?member.memberOneName:"无"}}</view>
				</u-form-item>
				<u-form-item label="队员2">
					<view>{{member.memberTwoName?member.memberOneName:"无"}}</view>
				</u-form-item>
				<u-form-item label="队员3">
					<view>{{member.memberThreeName?member.memberOneName:"无"}}</view>
				</u-form-item>
				<u-form-item label="队员4" :border-bottom="false">
					<view>{{member.memberFourName?member.memberOneName:"无"}}</view>
				</u-form-item>
			</u-form>
		</u-card>
	</view>
</template>

<script>
	export default {
		async onLoad(option) {
			var [err1, res1] = await this.$to(this.$api.get({
				url: "/square/project_detail?projectId=" + option.projectId
			}));
			this.project = res1.data;
			var [err2, res2] = await this.$to(this.$api.get({
				url: "/userinfo/group?projectId=" + option.projectId
			}));
			this.member = res2.data;
		},
		data() {
			return {
				project: null,
				member: null
			}
		},
		methods: {
			getColor(index) {
				let type = ["primary", "success", "info", "warning", "error"];
				return type[index % 5];
			},

		}
	}
</script>

<style lang="scss">
	body {
		background-color: $u-bg-color;
	}
</style>
